import { useReducer } from 'react';
import BaseLayout from '../components/BaseLayout';

const reducer = (s: number, action: string) => {
  if (action == 'add') {
    return s + 1;
  }
  return s;
};

export default () => {
  const [state, dispatch] = useReducer(reducer, 0);

  const handleAdd = () => {
    dispatch('add');
  };

  return (
    <BaseLayout>
      <div className='counter'>
        <h3>counter</h3>
        <div>counter: {state}</div>
        <button onClick={handleAdd}>add</button>
      </div>
    </BaseLayout>
  );
};
